<template>
	<form @submit.stop.prevent="formSubmit">
		<view style="padding:40rpx;">
			<view class="form-item">
				<input password type="password" placeholder="请输入旧密码" name="password" v-model="password" />
			</view>
			<view class="form-item">
				<input password type="password" placeholder="请输入新密码" name="newPassword" v-model="newPassword" />
			</view>
			<view class="form-item">
				<input password type="password" placeholder="再次输入新密码" name="confirmPassword"
					v-model="confirmPassword" />
			</view>
			<view class="form-item" style="border:none">
				<view style="font-size: 24rpx;color: #999999;">密码长度8-64位，由数字、字母和符号组成</view>
			</view>
			<view class="form-item form-item-submit">
				<button class="block radius-btn" type="primary" form-type="submit" style="margin-bottom: 10rpx">确认修改密码</button>
			</view>
			<view class="form-item" style="border-bottom: none">
				<text style="font-size: 24rpx; color: #999999">温馨提示：因设备延迟原因，修改密码后需等待1-5分钟后生效。</text>
			</view>
		</view>
	</form>
</template>

<script>
	// const CryptoJS = require('crypto-js');
	import {
		XMMD5Encrypt
	} from "@/utils/md5Encrypt.js"
	export default {
		data() {
			return {
				token: '',
				deviceNo: '',
				devUserName: '',
				password: '',
				newPassword: '',
				confirmPassword: ''
			};
		}
		/**
		 * 生命周期函数--监听页面加载
		 */
		,
		onLoad: function(options) {
			console.log('=== device-live:setting:password:', options);
			this.devPassWord = options.devPassWord
			this.token = options.token
			this.deviceNo = options.deviceNo
			this.devUserName = options.devUserName
		},
		/**
		 * 生命周期函数--监听页面初次渲染完成
		 */
		onReady: function() {},
		/**
		 * 生命周期函数--监听页面显示
		 */
		onShow: function() {},
		/**
		 * 生命周期函数--监听页面隐藏
		 */
		onHide: function() {},
		/**
		 * 生命周期函数--监听页面卸载
		 */
		onUnload: function() {},
		/**
		 * 页面相关事件处理函数--监听用户下拉动作
		 */
		onPullDownRefresh: function() {},
		/**
		 * 页面上拉触底事件的处理函数
		 */
		onReachBottom: function() {},
		/**
		 * 用户点击右上角分享
		 */
		onShareAppMessage: function() {},
		methods: {
			formSubmit(ev) {
				if (this.password.replace(/\s/g, '') === '') {
					uni.showToast({
						icon:"none",
						title: '请输入正确的旧密码',
						duration:2000
					});
					return;
				}

				if (this.newPassword.replace(/\s/g, '') === '') {
					uni.showToast({
						icon:"none",
						title: '请输入新密码'
					});
					return;
				}

				if (this.newPassword !== this.confirmPassword) {
					uni.showToast({
						icon:"none",
						title: '两次输入密码不一致'
					});
					return;
				}
				// uni.showLoading();
				// const token = this.token;
				this.setPassWord()
			},
			// 获取设备token
			setPassWord() {
				uni.showLoading({
					title: '加载中'
				})
				let sns = []
				sns[0] = this.deviceNo
				const data = {
					sns: sns
				};
				getApp().globalData.api.getDeviceToken(data, (result) => {
					console.log('获取设备token:', result);
					this.deviceLogin(result[0].token)
				});
			},
			// 登录设备
			deviceLogin(token) {
				let data = {
					Name: 'generalinfo',
					UserName: 'admin',
					PassWord: this.devPassWord,
					LoginType: 'DVRIP-Web',
					EncryptType: 'DISABLE'
				};
				getApp().globalData.api.deviceLogin(data, token, (result) => {
					console.log(result);
					this.resetPasswords(token)
				});
			},
			resetPasswords(token) {
				const data = {
					Name: 'MODIFYPASSWORD',
					UserName: this.devUserName,
					PassWord: XMMD5Encrypt(this.password),
					NewPassWord: XMMD5Encrypt(this.newPassword),
					EncryptType: 'DISABLE',
					// EncryptType: 'MD5'
				};
				getApp().globalData.api.usermanage(data, token, (result) => {
					if (result.Ret === 100) {
						uni.hideLoading()
						this.saveLoginInfo();
						uni.showModal({
							title: '提示',
							content: '修改密码成功！',
							showCancel: false,
							success: (res) => {
								uni.navigateBack({
									delta: 1
								});
							}
						});
						let updata = {
							deviceNo: this.deviceNo,
							devPassWord: XMMD5Encrypt(this.newPassword)
						};
						getApp().globalData.api.updateDevice(updata, (result) => {
							console.log(result)
						});
					} else {
						uni.hideLoading({
							success: (res) => {
								uni.showModal({
									title: '提示',
									content: result.retMsg,
									showCancel: false
								});
							}
						});
					}
				});
			},
			updateDevice() {
				let data = {
					deviceNo: this.deviceNo,
					deviceName: this.deviceName
				};
				getApp().globalData.api.updateDevice(data, (result) => {
					console.log(result)
				});
			},

			// 缓存登录信息
			saveLoginInfo() {
				let deviceList = uni.getStorageSync('deviceList');

				for (let i = 0; i < deviceList.length; i++) {
					const item = deviceList[i];

					if (item.deviceNo === this.deviceNo) {
						item.devPassWord = this.newPassword;
						break;
					}
				}

				uni.setStorageSync('deviceList', deviceList);
			}
		}
	};
</script>
<style>
	page {
		background-color: #ffffff;
	}

	.form {
		padding: 0 80rpx;
	}

	.form-item {
		display: flex;
		flex-direction: row;
		align-items: center;
		border-bottom: 1px solid #eeeeee;
		padding: 30rpx 0;
	}

	.form-item-title {
		width: 200rpx;
	}

	.form-item-control {
		justify-content: space-between;
		color: #777777;
		margin-bottom: 80rpx;
		border-bottom: none;
	}

	.form-item-submit {
		flex-direction: column;
		border-bottom: none;
	}
</style>
